<template>
  <div class="stand-book">

      <el-row :gutter="20" style="line-height:40px;margin-bottom:20px">
      
        <el-col :span="2">
            <div class="label-wrap category">
              <label for="">装备名称：</label>
            </div>
        </el-col>
        <el-col :span="3" style="margin-left:-25px">
            <el-input v-model="prod_name" size="small" placeholder="请输入装备名称"></el-input>
        </el-col>

        <el-col :span="2">
            <div class="label-wrap category">
              <label for="">装备编号：</label>
            </div>
        </el-col>
        <el-col :span="3" style="margin-left:-25px">
            <el-input v-model="prod_code" size="small" placeholder="请输入产品编号"></el-input>
        </el-col>

          <el-col :span="11">
            <el-button type="primary" size="mini" icon="el-icon-search" style="width:80px" @click="searchEdit">搜索</el-button>
          </el-col>

          <el-col :span="3">
            <el-button size="mini" icon="el-icon-download" type="primary">导出日志清单</el-button>
          </el-col>

      </el-row>

      <el-row>
        <el-col :span="24">
          <el-table :data="standbookList" border style="width: 100%">
            <el-table-column label="图片" width="60">
              <template slot-scope="scope">
                <div>
                  <img style="width:40px;height:40px;" :src="scope.row.prodImg" alt="">
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="prodCode" label="装备编号" width="120"></el-table-column>
            <el-table-column prop="prodName" label="装备名称" width="120"></el-table-column>
            <el-table-column prop="prodSpecial" label="规格" width="80"></el-table-column>
            <el-table-column prop="editType" label="类型" width="120"></el-table-column>
            <el-table-column prop="prodNum" label="数量"  width="100"></el-table-column>
            <el-table-column prop="emit" label="单位"></el-table-column>
            <el-table-column prop="prodArea" label="库区"></el-table-column>
            <el-table-column prop="prodDepart" label="库位"></el-table-column>
            <el-table-column prop="prodDate" label="创建日期"></el-table-column>
          </el-table>
        </el-col>
      </el-row>

      

      <div class="autospace"></div>

      <el-row>
        <el-col :span="24">
          <el-pagination
            class="pull-left"
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :page-sizes="['10']"
            layout="total, prev, pager, next"
            :total="30">
          </el-pagination>
        </el-col>
      </el-row>

  </div>
</template>

<script>
export default {
  name: 'standbook',
  data() {
    return {
        prod_name: '',
        prod_code: '',
        standbookList: [],
    }
    
  },
  methods:{
    handleSizeChange(val) {
        
    },
    handleCurrentChange(val) {

    },
   
    // 搜索库存装备
    searchEdit() {

    },
  },
}
</script>

<style lang="scss" scoped>
@import '../../styles/config.scss';

  .label-wrap {
    &.category { @include labelwrap(left,100,40); }
    &.date {
      @include labelwrap(center,50,40); }
    &.keyword { @include labelwrap(right,110,40); }
  }
  .autospace {
    height: 30px;
  }
  
  .top-add {
    width: 100%;
    height: 40px;
    margin-bottom: 20px;
    font-weight: 700;
    border-bottom: 1px solid #f1f1f1;
    display: flex;
  }
</style>
  
